<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>

<fmt:setBundle basename="ApplicationMessage" />
<fmt:setLocale value="zh_CN" />

<!DOCTYPE html>
<html lang="zh-CN">
<head>

  <%@ include file="/WEB-INF/include/meta.jsp"%>
  <%@ include file="/WEB-INF/include/css.jsp"%>
  
</head>

<body>

  <%@ include file="/WEB-INF/include/header.jsp"%>

  <%@ include file="/WEB-INF/include/menu.jsp"%>

  <div class="container main-content report">

    <div class="panel panel-default x-panel x-panel-layout">

      <div class="panel-heading">
        <ol class="breadcrumb">
          <li><a href="${ctx.host}/report">报表</a></li>
          <li class="active">结营学员报表</li>
        </ol>
      </div>

      <div class="panel-body">

        <div class="col-xs-2 x-panel-layout-left no-horizontal-padding">
          <%@ include file="/WEB-INF/include/submenu.jsp"%>
        </div>

        <div class="col-xs-10 x-panel-layout-right">

          <div class="x-breadcrumb-wrapper">
          
            <div class="x-breadcrumb clearfix">
            
            
              <h2><i class="glyphicon glyphicon-fire"></i>&nbsp;&nbsp;<span>报表&nbsp;-&nbsp;结营学员报表</span></h2>
              <div class="pull-right">
                <c:choose>
                  <c:when test="${not empty currentPrincipal.site}">
                    <span class="current-branchCode">${currentPrincipal.site.name}</span>
                  </c:when>
                  <c:otherwise>
                    <select name="site">
                      <option value="">所有门店</option>
                      <c:forEach var="site" items="${persist.getSites(currentPrincipal.id)}">
                        <option value="${site.id}" ${site.id == selectSite.id ? 'selected' : ''}>${site.name}</option>
                      </c:forEach>
                    </select>
                  </c:otherwise>
                </c:choose>
              </div>
            </div>
            
            <div class="x-breadcrumb-wrapper top-margin-20" style="position: relative;">
              <ul class="nav nav-pills x-breadcrumb-nav">
                <li class="pull-left${period eq 'day' ? ' active' : ''}"><a href="${ctx.host}/stop-camp-reports?site=${selectSite.id}&date=${day}&period=day">日</a></li>
                <li class="pull-left${period eq 'week' ? ' active' : ''}"><a href="${ctx.host}/stop-camp-reports?site=${selectSite.id}&date=${day}&period=week">周</a></li>
                <li class="pull-left${period eq 'month' ? ' active' : ''}"><a href="${ctx.host}/stop-camp-reports?site=${selectSite.id}&date=${day}&period=month">月</a></li>
                <div class="pull-right" style="margin-left:15px;">
                  <input type="text" class="form-control date" name="date" value="${day}" data-validate = "required" placeholder="请选择日期" readOnly/>
                </div>
                <a href="${ctx.host}/stop-camp-reports/export-view" data-target="#report-export" data-toggle="modal" class="btn btn-default x-btn btn-shadow btn-shadow-default pull-right">导出</a>
              </ul>
              
            </div>
            
          </div>
          
          <div class="tab-content">
            <div class="tab-pane fade active in"style="min-height: 100px;">
            
              <h2 class="title">
                <i class="glyphicon glyphicon-triangle-right" style="color: #FF8100;" title=""></i>&nbsp;&nbsp;<span>关键指标</span>
                <p class="form-control-statis pull-right">日期：${day}</p>
              </h2>
              
              <div style="margin: 0 15px;">
                <div class="x-breadcrumb-content row key-data">
                  <div class="col-xs-2">
                    <h1 class="text-center">${totalAmount}</h1>
                    <p class="text-center">总结营课程数</p>
                  </div>
                  <div class="col-xs-2" style="border-left: 1px solid #ccc;">
                    <h1 class="text-center">${individualCount}</h1>
                    <p class="text-center">总常规课程数</p>
                  </div>
                  <div class="col-xs-2" style="border-left: 1px solid #ccc;">
                    <h1 class="text-center">${specialCount}</h1>
                    <p class="text-center">总特色课程数</p>
                  </div>
                  <div class="col-xs-2" style="border-left: 1px solid #ccc;">
                    <h1 class="text-center">${postureCount}</h1>
                    <p class="text-center">总专项课程数</p>
                  </div>
                  <div class="col-xs-2" style="border-left: 1px solid #ccc;">
                    <h1 class="text-center">${yearCount}</h1>
                    <p class="text-center">总周期课程数</p>
                  </div>
                </div>
              </div>
              
              <c:forEach var="currentSite" items="${empty selectSite ? (persist.getSites(currentPrincipal.id)) : selectSite.arraySite}">
                <h2 class="title">
                  <i class="glyphicon glyphicon-triangle-right" style="color: #FF8100;" title=""></i>&nbsp;&nbsp;<span>${currentSite.name}</span>
                </h2>
                
                <div style="margin: 0 15px;">
                  <table class="table table-striped table-hover x-table" style="margin-bottom:20px;">
                    <thead>
                      <tr>
                        <th>大类</th>
                        <th colspan="4">常规课</th>
                        <th colspan="7">特色课</th>
                        <th colspan="2">专项课</th>
                        <th colspan="6">周期课</th>
                      </tr>
                    </thead>
                    <thead>
                      <tr>
                        <th>二类</th>
                        
                        <!-- 常规 -->
                        <th>常规课(其他)</th>
                        <th>急速燃脂</th>
                        <th>基础塑形</th>
                        <th>青少年专项</th>
                        
                        <!-- 特色 -->
                        <th>燃脂拳击</th>
                        <th>悬挂训练</th>
                        <th>恢复再生</th>
                        <th>孕产恢复</th>
                        <th>普拉提</th>
                        <th>形体雕刻</th>
                        <th>特色组合</th>
                        <th>全能课包</th>
                        
                        <!-- 专项 -->
                        <th>矫正美化</th>
                        <th>运康损伤疼痛</th>
                        <!-- 周期 -->
                        <th>年</th>
                        <th>月</th>
                        <th>季</th>
                        <th>特年</th>
                        <th>特月</th>
                        <th>特季</th>
                      </tr>
                    </thead>
                    <tbody>
                        <tr>
                          <td>结营数量</td>
                          <!-- 常规 -->
                          <td>${result[currentSite.id][1]}</td>
                          <td>${result[currentSite.id][3]}</td>
                          <td>${result[currentSite.id][5]}</td>
                          <td>${result[currentSite.id][7]}</td>
                          <!-- 特色 -->
                          <td>${result[currentSite.id][9]}</td>
                          <td>${result[currentSite.id][11]}</td>
                          <td>${result[currentSite.id][13]}</td>
                          <td>${result[currentSite.id][15]}</td>
                          <td>${result[currentSite.id][17]}</td>
                          <td>${result[currentSite.id][19]}</td>
                          <td>${result[currentSite.id][21]}</td>
                          <td>${result[currentSite.id][39]}</td>
                          
                          <!-- 专项 -->
                          <td>${result[currentSite.id][23]}</td>
                          <td>${result[currentSite.id][25]}</td>
                          
                          <!-- 周期 -->
                          <td>${result[currentSite.id][27]}</td>
                          <td>${result[currentSite.id][29]}</td>
                          <td>${result[currentSite.id][31]}</td>
                          <td>${result[currentSite.id][33]}</td>
                          <td>${result[currentSite.id][35]}</td>
                          <td>${result[currentSite.id][37]}</td>
                        </tr>
                        <tr>
                          <td>续课数量</td>
                          
                          <!-- 常规 -->
                          <td>${result[currentSite.id][2]}</td>
                          <td>${result[currentSite.id][4]}</td>
                          <td>${result[currentSite.id][6]}</td>
                          <td>${result[currentSite.id][8]}</td>
                          
                          <!-- 特色 -->
                          <td>${result[currentSite.id][10]}</td>
                          <td>${result[currentSite.id][12]}</td>
                          <td>${result[currentSite.id][14]}</td>
                          <td>${result[currentSite.id][16]}</td>
                          <td>${result[currentSite.id][18]}</td>
                          <td>${result[currentSite.id][20]}</td>
                          <td>${result[currentSite.id][22]}</td>
                          <td>${result[currentSite.id][40]}</td>
                          
                          <!-- 专项 -->
                          <td>${result[currentSite.id][24]}</td>
                          <td>${result[currentSite.id][26]}</td>
                          
                          <!-- 周期 -->
                          <td>${result[currentSite.id][28]}</td>
                          <td>${result[currentSite.id][30]}</td>
                          <td>${result[currentSite.id][32]}</td>
                          <td>${result[currentSite.id][34]}</td>
                          <td>${result[currentSite.id][36]}</td>
                          <td>${result[currentSite.id][38]}</td>
                        </tr>
                    </tbody>
                  </table>
                  
                </div>
              </c:forEach>
              
              <h2 class="title clearfix">
                <i class="glyphicon glyphicon-triangle-right" style="color: #FF8100;" title=""></i>&nbsp;&nbsp;<span>详细数据</span>
              </h2>
              
              <div style="margin: 0 15px;">
                  <table class="table table-striped table-hover x-table" style="margin-bottom:20px;">
                    <thead>
                      <tr>
                        <th>门店</th>
                        <th>课程</th>
                        <th>已完成课时</th>
                        <th>学员</th>
                        <th>教练</th>
                        <th>结营时间</th>
                        <th>操作</th>
                      </tr>
                    </thead>
                    <tbody>
                      <c:forEach var="courseRound" items="${courseRoundList}">
                        <tr>
                          <td>${courseRound.site.name}</td>
                          <td>${courseRound.courseType.year ? '月卡季卡课程' : (courseRound.course.experience ? '1V1体验课' : (courseRound.course.give ? '1V1赠课' : '1V1'))}</td>
                          <td>
                            ${courseRound.finished}
                            <c:if test="${courseRound.courseType.individual}">/${not empty courseRound.attrs['course_amount'] ? courseRound.attrs['course_amount'].value : courseRound.course.hours}</c:if>
                          </td>
                          <td>${courseRound.student.name}</td>
                          <td>${courseRound.coach.name}</td>
                          <td>${courseRound.finishTime}</td>
                          <td><a href="${ctx.host}/${courseRound.courseType.alias}-rounds/${courseRound.id}">详情</a></td>
                        </tr>
                      </c:forEach>
                    </tbody>
                  </table>
                  
                </div>
              
            </div>
          </div>
          
        </div>

      </div>

    </div>

  </div>

  <%@ include file="/WEB-INF/include/script.jsp"%>
  <d:resource root="${ctx.resource}/build" type="script" src="js/page/report/stop-camp-report.js">
    <script type="text/javascript">
      require(['page/report/stop-camp-report'], function(page) {
        page.init({
          "date": '${day}',
          "site": '${selectSite.id}',
          "today": '${today}'
        })
      })
    </script>
  </d:resource>
  
</body>
</html>